<template>
  <div class="c-dchart-box">
    <div class="c-dchart" ref="chartContent" ></div>
  </div>
</template>

<script>
export default {
  name: "chart",
  props: {
  },
  data() {
    return {
      chart: null,
    };
  },
  mounted() {
  },
  methods: {
    dchartInit(chartData) {
      this.$nextTick(() => {
        this.chart = new DCharts(this.$refs.chartContent, chartData);
        this.chart?.render();
      })
    },
    dchartDestroy() {
      this.chart?.destroy();
    }
  },
  beforeDestroy() {
  },
  watch: {
    option(newVal, oldVal) {
      if (!newVal || !this.chart) {
        return;
      }
      this.chart.setOption(newVal);
    },
  },
};
</script>

<style lang="less">
@import url("./chart.less");
</style>
